<template>
  <div class="header-nav-dropdown-wrapper">
    <ul class="ul-dropdown-list">
      <li v-for="item in TRADE_LIST" :key="item.value" class="item" @click.stop="navClick(item)">
        <div class="item-title">{{ item.title }}</div>
        <div class="item-text">{{ item.text }}</div>
      </li>
    </ul>
  </div>
</template>

<script>
import { TRADE_LIST } from './navmenu.data';
import { verifyRoles } from '@/utils/verify';
export default {
  data () {
    return {
      TRADE_LIST
    };
  },
  methods: {
    navClick (item) {
      //  this.$emit('nav-click', item);
      if (item.title === '交易前准备' || item.title === 'FICC交易云') {
        this.$emit('nav-click', item);
      } else {
        // 权限控制
        const judge = verifyRoles('trade', 0);
        if (judge) {
          this.$emit('nav-click', item);
        }
      }
    }
  }
};
</script>
<style lang="scss" scoped>
@import '@/styles/header.nav.scss';
</style>
